
<script type="text/javascript">

    $(document).ready(function(){        
      obtener_Nombre();
       $("#cmbFamilia").change(function(evento){
            cargarArticulosFamilia();                        
        });
    }); 
       function cargarArticulosFamilia()
    {       
        $('#tablaArticulosFamilia').show();
        $('#bodyArticulosFamiliaTable').each(function() {
            $(this).empty();
        });
        var accion ='cargarArticulosFamilia';
        var familia = $('#cmbFamilia').val();
        $.get("controladores/ajaxControlador.php",{accion:accion,familia:familia},function(resultado){
            if(resultado == false)
            {
                alert("Error al cargar los Articulos de la Familia.");
            }
            else
            {  
                $('#bodyArticulosFamiliaTable').append(resultado);
            }
            $('#articulo').click();
        });
    }
     function MostrarArticulos(){
         $('#tablaArticulosFamilia').show();
     }   
     function TraeDescripcionDirectriz(Directriz){
         alert(Directriz);
     }
    function  CheckArticuloFamilia(descripcion,codArticulo){
        $('#tablaArticulosFamilia').hide();
        $('#articuloDescripcion').val(descripcion);
        $('#articuloCodigo').val(codArticulo);
    }
    function CalcularTotal(valor,temp){
        var res;
        var total=$("#strTotal").val(); 
        if($(temp).is(":checked")){
            res=parseFloat(total)+parseFloat(valor);            
        }else{
            res=parseFloat(total)-parseFloat(valor);            
        }
        $("#strTotal").val(res);
    }
    
    $(function(){
       $('#frmDirectrices').validate({
           rules: {
           'cmbFamilia': { required: true, min: 1 },//minimo el valor 1 seleccionado
           'articulo': { required: true }
           },
       messages: {
           'cmbFamilia': 'Debe seleccionar una Familia',
           'articulo': 'Debe ingresar el articulo'
       }
    });
});
    
</script>

<ul class="breadcrumb">
    <li><a href="index.php">Inicio</a> <span class="divider">&raquo;</span></li>
    <li><a href="index.php?accion=paginaPrincipal">Men&uacute; principal</a> <span class="divider">&raquo;</span></li>
    <li><a href="index.php?accion=listarClientesXDia&controlador=cliente">Cliente selecci&oacute;n</a> <span class="divider">&raquo;</span></li>
    <?php echo "<li><a href=index.php?accion=MenuClienteSeleccion&id=".$_SESSION['IdCliente']."&tipoCliente=".$_SESSION['TipoCliente'].">Men&uacute; cliente</a> <span class='divider'>&raquo;</span></li>"?>
    <li><a href="index.php?accion=MenuSupervisor">Men&uacute; supervisor</a> <span class="divider">&raquo;</span></li>
    <li class="active">Directrices</li>
</ul>

<div class="grid">
    <form action="index.php?accion=agregarDirectrices&controlador=supervisor" method="post" id="frmDirectrices" name="frmDirectrices" onSubmit="">
             <div class="col_12">
         
            <section id="cbcFamilia"> 
                <label for="cmbFamilia">Familia:</label>
                <select id="cmbFamilia" name="cmbFamilia" tabindex="2" class="selmenu">
                    <option value="0">Selecciona Uno...</option>
                    <?php
                        if (sizeof($itemsFamilias) > 0) {
                            foreach ($itemsFamilias as $item) {
                                $codFamilia = $item['CodFamilia'];
                                $descripcion = $item['Descripcion'];
                                echo "<option value='$codFamilia'>$descripcion - $codFamilia</option>";
                            }
                        }
                    ?> 
                </select>
            </section>
        </div>
        <div class="col_12">
        <div class="tab-pane active" id="tablaArticulosFamilia">

            <p>
                Busqueda: <input id="filter" type="text" tabindex="3"/>
                <a href="#clear" class="clear-filter" title="clear filter"><i class="icon-rss"></i> Limpiar</a>
                <span class="row-count"></span>
            </p>
        <table class="table demo" data-filter="#filter" data-page-size="10">
                <thead>
                    <tr>
                        <th data-toggle="true">
                            Descripci&oacute;n
                        </th>
                        <th data-toggle="true" id="articulos">
                            Articulo
                        </th>
                        
                    </tr>
                </thead>
                <tbody id="bodyArticulosFamiliaTable">

                            <!--Aqui se insertan lo tr generados por jquery mediante el metodo cargarFmilias()-->

                </tbody>
                <tfoot class="hide-if-no-paging">
                    <tr>
                        <td colspan="12">
                            <div class="pagination pagination-centered"></div>
                        </td>
                    </tr>
                </tfoot>
            </table>
            </div>
            </div>
        <div class="col_12">
                    <input  readonly class="col_9" type="textArea" name="articulo" value=""id="articuloDescripcion" placeholder="Articulo" autocomplete="off" tabindex="1" />
                    <input class="col_1" type="button" value="Cambia Articulo" onClick = 'MostrarArticulos()'/>
        </div>
        <div class="col_12">
                    <input  readonly class="col_4" type="text" name="articuloCodigo" value=""id="articuloCodigo" placeholder="Codigo" autocomplete="off" tabindex="1" />
        </div>
        <div class="col_8">
            <div class="col_12">
                    <input type="checkbox" onClick ='CalcularTotal(40,this)' name="strRegistro"  id="strRegistro" />
                    <label for="check1" class="inline">Registro (40%)</label>
                <div class="pull-right">
                    <input  type="button" value="?" onClick = 'TraeDescripcionDirectriz("REGISTRO")'/>
                </div>
            </div> 
            <div class="col_12">
                    <input type="checkbox" onClick ='CalcularTotal(30,this)' name="strEstrategia" id="strEstrategia" />
                    <label for="check2" class="inline">Estrategia Precio (30%)</label>
                <div class="pull-right">
                    <input  type="button" value="?" onClick = 'TraeDescripcionDirectriz("PRECIOS")'/>
                </div>
            </div>
            <div class="col_12"> 
                    <input type="checkbox" onClick ='CalcularTotal(15,this)' name="strUbicacion" id="strUbicacion" />
                    <label for="check3" class="inline">Ubicaci&oacute;n (15%)</label>
                <div class="pull-right">
                    <input  type="button" value="?" onClick = 'TraeDescripcionDirectriz("UBICACION")'/>
                </div>
            </div>  
            <div class="col_12">
                    <input type="checkbox" onClick ='CalcularTotal(15,this)' name="strAmbientacion" id="strAmbientacion" />
                    <label for="check4" class="inline">Ambientaci&oacute;n (15%)</label>
                <div class="pull-right">
                    <input  type="button" value="?" onClick = 'TraeDescripcionDirectriz("AMBIENTACION")'/>
                </div>
            </div>    
        </div>
            <div class="col_12">
                <label class="col_2" for="text2">Total Documento:</label>
                <input class="col_5" readonly type="text" name="strTotal" value="0"id="strTotal" placeholder="0" autocomplete="off" tabindex="1" />
            </div>
            <div class="col_12">
               <input type="submit" name="submit" id="submitbtn" class="blue" tabindex="12" value="Guardar">
            </div>
        </form>
    
    </div>